<template>
	<unit-table
		:columns="this.isManager?this.$staticMenu.traceDataColumns:this.$staticMenu.traceDataNoActionColumns"
    :url="tableUrl"
    selectType="checkbox"
    :type="tableType"
    :params="tableParams"
    :size="pageSize"
    :sizeOptions="pageSizeOptions"
    :selectedKeys="tableSelectedKeys"
    rowKeyName="id"
    ref="unitTable"
    @onSelect="tableOnSelect"
	>
    <!-- 补充搜索条件 -->
    <a-row slot="searchCri">
      <a-col :span="3">
        <a-input v-model="tableParams.fileConfig" class="searchCriteria" placeholder="数据标识" />
      </a-col>
      <a-col :span="4">
            <a-range-picker
              class="searchCriteria"
              v-model="time"
              @change="timeChange"
              />
        </a-col>
      <a-col :span="3">
        <a-select
          v-model="tableParams.status"
          class="searchCriteria"
         v-if="this.isManager"
        >
          <a-select-option v-for="(item, key) of fileStatus"
                           :key='item.value'
                           :value="item.value"
          >{{ item.label }}
          </a-select-option>
        </a-select>
      </a-col>
      <a-col :span="14" style="text-align: right;">
        <a-button type="primary" @click="criteriaSearch">
          <a-icon type="search"/>
          查询
        </a-button>
        <a-button @click="clearCriteria">
          <a-icon type="sync"/>
          </i>重置
        </a-button>
      </a-col>
    </a-row>
    <!-- end -->
    <!-- 补充表格操作 -->
    <div slot='tableAct' class="actionBtn">

      <a-button type="primary" @click="exportData">
        <a-icon type="download"/>
        导出
      </a-button>
      <span style="float:right"  v-if="this.isManager&&approved=='未审批'">
          <a-button type="primary" class="btn-success" @click="acceptAll">
            <a-icon type="check" />审批通过
          </a-button>
          <a-button type="danger" @click="rejectAll">
            <a-icon type="close"/>拒绝
          </a-button>
        </span>
    </div>
    <!-- end -->
     <span slot="statusSwitch" slot-scope="props">
        <span v-if="props.record.status=='审批通过'" class="text-success">{{props.record.status}}</span>
        <span v-if="props.record.status=='审批拒绝'" class="text-danger">{{props.record.status}}</span>
        <span v-if="props.record.status=='未审批'">{{props.record.status}}</span>
      </span>
    <!-- 补充表格每行的操作 -->
    <span slot="tableRowAct" slot-scope="props">

<!--			<a-divider type="vertical" v-if="props.record.status=='未审批'" />-->
			<a v-if="props.record.status=='未审批'" @click="accept(props.record)">
				<span class="ant-tag ant-tag-green">
					<a-icon type="check"/> 审批通过
				</span>
			</a>
<!--      <a-divider type="vertical" v-if="props.record.status=='未审批'" />-->
			<a v-if="props.record.status=='未审批'" @click="reject(props.record)">
				<span class="ant-tag ant-tag-volcano">
					<a-icon type="close"/> 拒绝
				</span>
			</a>
<!--      <a-divider type="vertical"/>-->
			<a  @click="deletefile(props.record)">
				<span class="ant-tag ant-tag-volcano">
					<a-icon type="close"/> 删除
				</span>
			</a>
      </span>
  </unit-table>

</template>

<script>
import {GETALLTRACELIST,GETALLSTATUS,TRACEAPPROVALACCEPT,TRACEAPPROVALREJECT,TRACEDELETE,GETTRACEACCEPTLIST} from '@/../static/js/apis.js'
import unitTable from "@/common/table"
import global from "@/../static/global.vue"
export default {
  inject:['reload'],
  name: 'allUnit',
  components: {
  	unitTable
  },
  data() {
    return {
      time:[],
      fileStatus: [],
      treeSelectedKeys: '0',
      tableSelectedKeys: [],
      tableType: GETALLTRACELIST.type,  //调用表格组件，必须参数，后台方法方法（get，post）
      pageSize: 15,
      pageSizeOptions: ['15', '20', '40'],
      /*调用表格组件，可选参数，其他相关搜索条件*/
      tableParams: {
        fileConfig: "",
        timeRange: [],
        status: "全部审批状态",
        menuId: this.$route.query.menuId
      },
      approved: '',
      modalTitle: '',     //modal标题
      modalVisible: false,    //modal关闭打开控制器
    }
  },
  computed: {
    // 判断是否管理员
    isManager() {
      return global.isManager(global.SYS_DATA_MANAGE)
    },
    tableUrl () {
      return global.isManager(global.SYS_DATA_MANAGE)
        ? GETALLTRACELIST.url
        : GETTRACEACCEPTLIST.url
    }
  },
  methods: {
    /*获取静态数据*/
    getStaticData() {
      let self = this
      GETALLSTATUS('', function (res) {
        self.fileStatus = res.obj
      })
    },
    timeChange(date, dateString) {
         this.tableParams.timeRange=dateString
      },
  	/*表格checkbox选中事件*/
  	tableOnSelect (selectedRowKeys, selectedRows) {
  		this.tableSelectedKeys = selectedRowKeys
  	},
  	// /*选择当前状态*/
  	// handleYearChange (value) {
  	// 	this.tableParams.fileYear = value
  	// },
  	// handleLocationChange (value) {
  	// 	this.tableParams.region = value
  	// },
  	// handleTypeChange (value) {
  	// 	this.tableParams.fileType = value
  	// },
  	// handleLevelChange (value) {
  	// 	this.tableParams.fileSecurity = value
  	// },
  	/*查询按钮*/
  	criteriaSearch () {
      this.approved=this.tableParams.status
  		this.$refs.unitTable.fetch(1)
  	},
    /*重置按钮*/
    clearCriteria () {
      this.tableParams.timeRange = []
      this.time=[]
      this.tableParams.filecongfig = ''
      this.tableParams.status = '全部审批状态'
      this.$refs.unitTable.rowSelection.onChange([ ],[ ])
      this.criteriaSearch()
    },

    importFile() {
      this.modalTitle = "导入文件"
      this.modalVisible = true
    },
    /*modal确定事件*/
    handleOk(e) {
      this.modalVisible = false
    },
    /*modal取消事件*/
    handleCancel(e) {
      this.modalVisible = false
    },
    exportData() {
      const selectedRowKeys = this.tableSelectedKeys
      if (selectedRowKeys.length > 0) {
        window.open(global.dataManUrl + "/rest/trace/downloadMulFile?fileIds=" + selectedRowKeys);
      } else {
        this.$message.warning("请在表格中勾选要导出的数据！")
      }
    },
    acceptAll() {
      console.log("67890");
      let self = this
      const selectedRowKeys = self.tableSelectedKeys
      var param = {
        ids: selectedRowKeys,
        userId: this.userId
      }
      if (selectedRowKeys.length > 0) {
        TRACEAPPROVALACCEPT(param, function (res) {
          self.$message.success(res.message)
          self.reload()

        })
      } else {
        self.$message.warning("请在表格中勾选要审批的数据！")
      }
    },
    rejectAll() {
      console.log("12345");
      let self = this
      const selectedRowKeys = self.tableSelectedKeys
      var param = {
        ids: selectedRowKeys,
        userId: this.userId
      }
      if (selectedRowKeys.length > 0) {
        TRACEAPPROVALREJECT(param, function (res) {
          self.$message.success(res.message)
          self.reload()
        })
      } else {
        self.$message.warning("请在表格中勾选要审批的数据！")
      }
    },
    accept(record) {
      let self = this
      var param = {
        ids: [record.id],
        userId: this.userId
      }
      this.$confirm({
        title: '确定要通过该项吗?',
        content: '',
        onOk () {
          TRACEAPPROVALACCEPT(param, function (res) {
            self.$message.success(res.message)
            self.reload()

          })
        }
      })

    },

    deletefile(record) {
      let self = this
      var param = {
        ids: [record.id],
        userId: this.userId
      }

      this.$confirm({
        title: '确定要删除该项吗?',
        content: '',
        onOk () {
          TRACEDELETE(param, function (res) {
            self.$message.success(res.message)
            self.reload()
          })
        }
      })
    },
    reject(record) {
      let self = this
      var param = {
        ids: [record.id],
        userId: this.userId
      }
      this.$confirm({
        title: '确定要拒绝该项吗?',
        content: '',
        onOk () {

          TRACEAPPROVALREJECT(param, function (res) {
            self.$message.success(res.message)
            self.reload()

          })
        }
      })
    },
  },
  created() {
    this.getStaticData()
  },
  mounted() {
    // console.log(this.isManager)
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
.searchCriteria{
	width:80%;
}
.actionBtn button:not(:last-child),
.ant-row button:not(:last-child){
	margin-right:20px;
}
.ant-tag{
  margin: 5px;
}
</style>
